import axios from 'axios'
import { userStore } from '@/stores'
import router from '@/router'
import { showToast } from 'vant'

// 这里的axios.create 是创建一个单独的axios实例，
// 下面的代码模板，所有项目都一样，要么去看官网，要么看之前自己写的项目
// 参考之前的模板，直接cv，改一些具体的值就可以了
const instance = axios.create({
  // TODO 1. 基础地址，超时时间
  baseURL: 'https://consult-api.itheima.net',
  timeout: 6000
})

instance.interceptors.request.use(
  (config) => {
    // TODO 2. 携带token
    const store = userStore()
    if (store.user?.token) {
      config.headers.authorization = `Bearer ${store.user?.token}`
    }
    return config
  },
  (err) => Promise.reject(err)
)

// 响应拦截器：一般做 1.数据脱壳处理，2.业务成功业务失败，3.401token失效的处理
instance.interceptors.response.use(
  // 第一个函数都属于请求成功，但是业务有成功和失败， 状态码是2xx 3xx
  (res) => {
    // 下面判断用户请求的业务成功，要后端java他们告诉我们
    if (res.data?.code === 10000) {
      // 脱壳
      return res.data
    } else {
      showToast(res.data?.message || '请求失败')

      // 业务失败
      //提示个错误
      return Promise.reject(res)
    }
  },
  (err) => {
    // 下面这里的函数是请求失败，http状态码是 4xx 5xx
    // TODO 5. 处理401错误
    if (err.response?.status === 401) {
      // 进入了这里表示token 失效了，应该退出到登录界面，并且将token还有本地储存等数据清空
      const store = userStore()
      store.delUser()
      router.push('/login')
      return Promise.reject(err)
    }
    // 不是401就给个错误提示，在返回失败的promise
    return Promise.reject(err)
  }
)

export default instance

export const request = (url: string, method: string, obj?: any) => {
  if (!obj) {
    return instance.request({
      url,
      method
    })
  }
  return instance.request({
    url,
    method,
    // 动态的key，使用数组的中括号形式去写
    [method.toUpperCase() === 'GET' ? 'params' : 'data']: obj
    // data: obj,
    // params: obj
  })
}
